<template>
    <Form ref="form" :model="form" :rules="ruleValidate" label-position="left" :label-width="100">

        <FormItem label="检查项" prop="watchlists_check_id">
            <Select v-model="form.watchlists_check_id" multiple>
                <Option v-for="item in parentList" :value="item.value" :key="item.value" placeholder="请选择检查项">{{ item.label }}</Option>
            </Select>
        </FormItem>

        <FormItem label="状态名称" prop="name.zh">
            <Input v-model="form.name.zh" placeholder="输入状态名称"></Input>
        </FormItem>

        <FormItem label="检查项" prop="t_type">
            <RadioGroup v-model="form.t_type">
                <Radio :label="1">推送</Radio>
                <Radio :label="0">不推送</Radio>
            </RadioGroup>
        </FormItem>

        <FormItem>
            <Button type="primary" @click="handleSubmit('form')" :loading="butload">{{ condition?'修改':'添加' }}</Button>
        </FormItem>

    </Form>
</template>

<script>
export default {
    props: {
        condition: {
            type: [Boolean, Number],
            default: false
        }
    },
    data () {
        return {
            butload: false,
            form:{
                name: {
                    zh: null,
                    en: null,
                    mn: null,
                },
                t_type: 1,
                sort: '0',
                watchlists_check_id: []
            },
            addurl:'api/watchlists/v1/securityrules/add',
            editurl: 'api/watchlists/v1/securityrules/edit/' + this.condition,
            selUrl: 'api/watchlists/v1/securityrules/info/' + this.condition,

            ruleValidate: {
                t_type: [
                    { required: true, type: 'number', message: '输选择是否推送', trigger: 'change' }
                ],
                watchlists_check_id: [
                    { required: true, type: 'array', message: '输选择检查项', trigger: 'change' }
                ],
                'name.zh': [
                    { required: true, message: '输入状态名称', trigger: 'blur' }
                ]
            },

            parentList: [],
            parenturl: 'api/watchlists/v1/securityitem/noParentCheckData'
        }
    },
    methods: {
        
        /************************************************************
         * 
         * 表单验证
         * @param   {name}            要验证的表单
         * 
         ************************************************************/
        handleSubmit (name) {
            this.$refs[name].validate((valid) => {
                if (valid) {
                    this.butload = true
                    if (this.condition) {
                        this.editSubmit ()
                    } else {
                        this.addSubmit ()
                    }
                } else {
                    this.$Message.error('请检查填写内容');
                }
            })
        },
        
        /************************************************************
         * 
         * 执行添加数据
         * 
         ************************************************************/
        addSubmit () {
            this.$http.post(this.addurl, this.form).then(val=>{
                this.butload = false
                this.$emit('requery',true)
            }).catch(err => {
                this.butload = false 
            })
        },
        
        /************************************************************
         * 
         * 执行修改数据
         * 
         ************************************************************/
        editSubmit () {
            this.$http.put(this.editurl, this.form).then(val=>{
                this.butload = false
                this.$emit('requery',true)
            }).catch(err => {
                this.butload = false 
            })
        },
        
        /************************************************************
         * 
         * 执行修改数据
         * 
         ************************************************************/
        queryData () {
            this.$http.get(this.parenturl).then(val=>{
                this.parentList = val.data.map(el => ({
                    label: el.name,
                    value: el.watchlists_check_id
                }))
            }).catch(err => {
            })
        },
        
        /************************************************************
         * 
         * 单条查询
         * 
         ************************************************************/
        selData(){
            this.$http.get(this.selUrl).then(val=>{
                this.form.name = val.data.name
                this.form.t_type = val.data.t_type
                this.form.watchlists_check_id = val.data.watchlists_check_id
            }).catch(err => {
            })
        }
    },
    created () {
        if (this.condition) this.selData ()
        this.queryData ()
    },
};
</script>